{include file="public/header" /}

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body ">
                    <form class="layui-form layui-col-space5">
                        <div class="layui-inline layui-show-xs-block">
                            <select name="status" class="layui-input">
                                <option value="">类型</option>
                                <option value="1" {if !empty(input('get.status')) &&
                                    input('get.status')==1}selected{/if}>
                                    未回复
                                </option>
                                <option value="2" {if !empty(input('get.status')) &&
                                    input('get.status')==2}selected{/if}>
                                    已回复
                                </option>
                            </select>
                        </div>
                        <div class="layui-inline layui-show-xs-block">
                            <input type="text" name="mobile" placeholder="用户账号|ID" value="{:input('get.mobile')}"
                                autocomplete="off" class="layui-input">
                        </div>

                        <div class="layui-inline layui-show-xs-block">
                            <button class="layui-btn" lay-submit="" lay-filter="sreach">搜索</button>
                        </div>
                    </form>
                </div>
                <div class="layui-card-header">
                    共有数据：<strong id="count">{$list->total()}</strong> 条
                </div>
                <div class="layui-card-body layui-table-body layui-table-main">
                    <table class="layui-table layui-form">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>用户信息</th>
                                <th>说明</th>
                                <th>图片</th>
                                <th>是否回复</th>
                                <th>回复内容</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody>
                            {foreach $list as $v}
                            <tr>
                                <td>{$v.id|default='0'}</td>
                                <td>用户ID：{$v.user_id|default=''}<br />用户账号:{$v.mobile|default=''}</td>
                                <td>{$v.content|default=''}</td>
                                <td>
                                    {foreach $v.cover as $images}
                                    <img onclick='showimg("{$images}")' src="{$images|default=''}" alt="图片">
                                    {/foreach}
                                </td>
                                <td>
                                    {if $v.status == 0}
                                    未回复
                                    {else}
                                    已回复
                                    {/if}
                                </td>
                                <td>{$v.content_admin|default=''}</td>
                                <td class="td-manage">
                                    <button title="回复"
                                        onclick="orderstr('回复','{:url('message_add')}','{$v.id}','{$v.content_admin}')"
                                        href="javascript:;" class="layui-btn">回复
                                    </button>
                                </td>

                            </tr>
                            {/foreach}

                        </tbody>
                    </table>
                </div>
                <div class="layui-card-body ">
                    <div class="page">
                        {$list->render()|raw}
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>
</body>
<script>
    layui.use(['form', 'upload'], function () {
        var $ = layui.jquery
            , upload = layui.upload;
        //图片上传
        var uploadInst = upload.render({
            elem: '#test1'
            , url: 'users_top'
            , accept: 'file'
            , exts: 'xls|csv'
            , before: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#demo1').attr('src', result); //图片链接（base64）
                });
            }
            , done: function (res) {
                //如果上传失败
                if (res.status > 0) {
                    return layer.msg(res.msg);
                }
                //上传成功
                return layer.msg(res.msg);
            }
            , error: function () {
                //演示失败状态，并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function () {
                    uploadInst.upload();
                });
            }
        });
    });

    function showimg(imgs) {
        console.log(imgs);
        layer.open({
            type: 1,
            title: false,
            shadeClose: true,
            skin: 'layui-layer-nobg', //没有背景色
            content: "<img src='" + imgs + "' style='width:100%;height: 100%;'>"
        });
    }
    function orderstr(title, url, id, reply) {
        layer.prompt({
            formType: 2,
            value: reply,
            title: '请输入回复内容',
            area: ['500px', '200px'] //自定义文本域宽高
        }, function (value, index, elem) {
            $.post(url, { id: id, reply: value }, function (data) {
                if (data.status == 0) {
                    layer.msg(data.msg, { icon: 6, time: 1000 }, function () {
                        // 获得frame索引
                        parent.location.reload();
                        parent.layer.close(index);
                    });
                } else {
                    layer.msg(data.msg, { icon: 2, time: 1000 });
                }
            });
        });
    }
</script>
{include file="public/footer"}